<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Education Management System</title>
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='stylesheets/admin_index.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='stylesheets/index.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='stylesheets/tw.css') }}">
</head>

<body>

    <header>
        <span class="title">Educational Management System</span>
        <a id="logout-btn" href="/logout">Logout</a>
        <a id="welcome">Welcome, {{name}} ({{kind}})</a>
    </header>

    <div style="height: calc(100vh - 76px);" class="flex items-start w-full">
        <nav id="sidebar">
            <ul>
                <li><a href="/">Home</a></li>
                <li><a href="/account">Account Management</a></li>
                <li><a href="/course" class="active">Course Management</a></li>
                <li><a href="/lecture">Lecture Management</a></li>
                <li><a href="/forum">Forum Management</a></li>
            </ul>
        </nav>
    
        <div class="table_display_div flex-auto">
            <div class="table_head">
                <b>Course Management</b>
                <form class="table_search" name="message_search" id="message_search" method="get">
                    <input type="text" name="search_input" id="search_input" class="input">
                    <input type="submit" name="search" id="search" value="Search" class="input-btn">
                </form>
                <button class="stroke-btn" name="create_course" id="create_course" type="button"
                    onclick="window.location.href='/course/create'">Create Course</button>
                <button class="stroke-btn" name="requests" id="requests" type="button"
                    onclick="window.location.href='/course/request'">Requests From Students</button>
    
            </div>
            <table class="table_display" id="course_table" name="course_table">
                <thead>
                    <tr>
                        <th>Course ID</th>
                        <th>Course Name</th>
                        <th>Instructor</th>
                        <th>Course Description</th>
                        <th>Details</th>
                        <th>Operations</th>
                    </tr>
                </thead>
                <tbody>
                    {% for course in courses %}
                    <tr>
                        <td>{{course[0]}}</td>
                        <td>{{course[1]}}</td>
                        <td>{{course[2]}}</td>
                        <td>{{course[3]}}</td>
                        <td><a href="/course/view?course_id={{course[0]}}" class="main-btn">View</a>&nbsp;</td>
                        <td>
                            <a href="/course/edit?course_id={{course[0]}}" class="main-btn mr-3">Edit</a>
                            <a href="/course/delete?course_id={{course[0]}}" class="warn-btn">Delete</a>
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>

    <footer></footer>

    <script src="{{ url_for('static', filename='js/main.js') }}"></script>

</body>

</html>